import { LucideIcon } from 'lucide-react';

interface PageHeaderProps {
  title: string;
  subtitle?: string;
  icon?: LucideIcon;
}

export default function PageHeader({ title, subtitle, icon: Icon }: PageHeaderProps) {
  return (
    <div className="bg-gradient-to-r from-[#0e4c92] to-[#5cb8b2] text-white py-12">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div className="text-center">
          <div className="flex items-center justify-center mb-4">
            {Icon && <Icon className="h-10 w-10 mr-4" />}
            <h1 className="text-4xl font-bold">{title}</h1>
          </div>
          {subtitle && (
            <p className="text-xl text-blue-100 max-w-3xl mx-auto">
              {subtitle}
            </p>
          )}
        </div>
      </div>
    </div>
  );
}
